<template>
  <view class="wyts-wrapper">
    <view class="main-pd">
      <view class="u-flex u-flex-between u-p-b-20">
        <view class="color-333 font-28">请填写投诉信息：</view>
        <view class="color-f34b47 font-28" @click="$u.route('/pages/wyts/tsjl')">投诉记录</view>
      </view>
      <view class="qus-block">
        <view class="font-28 color-595959 u-p-b-20"
          ><text class="color-f34b47">*</text> 投诉事项</view
        >
        <u-textarea
          border="none"
          v-model="qusForm.title"
          :maxlength="20"
          placeholder="请输入..."></u-textarea>
      </view>
      <view class="qus-block u-m-t-20">
        <view class="font-28 color-595959 u-p-b-20">投诉具体描述</view>
        <u-textarea
          border="none"
          :maxlength="100"
          height="200rpx"
          v-model="qusForm.content"
          placeholder="请输入..."></u-textarea>
      </view>
      <view class="u-m-t-20 bx-msg">
        <u-cell-group :border="false">
          <u-cell title="投诉人" :value="fcMsg.dzkName"></u-cell>
          <u-cell title="所在单元" :value="fcMsg.louNumber + '号楼' + fcMsg.dyNumber + '单元' + fcMsg.fjNumber + '号'"></u-cell>
          <u-cell title="所属小区" :value="fcMsg.deptName"></u-cell>
          <u-cell title="投诉时间" :value="tsTime" :border="false"></u-cell>
        </u-cell-group>
      </view>
      <view class="u-m-t-106 u-p-b-80">
        <u-button
          text="提交"
          shape="circle"
          color="linear-gradient(90deg, #FA827D 0%, #F34B47 100%)"
          :customStyle="{
            fontSize: '36rpx',
            height: '96rpx',
          }"
          @click="addTsHandle"></u-button>
      </view>
    </view>
  </view>
</template>

<script setup>
import { ref, reactive, getCurrentInstance } from "vue";
import { onLoad } from "@dcloudio/uni-app";
import { addTsApi, getcardInfoApi } from "@/api/index";
const { proxy } = getCurrentInstance();
import useInfoStore from "@/store/user";
const userStore = useInfoStore();
import { checkEmpty } from "@/utils/common";
const day = proxy.day;
let qusForm = reactive({
  title: "",
  content: "",
  dzyzkId: userStore.dzyzkId,
});
let fcMsg = ref({});
// 投诉时间
let tsTime = ref();
// 获取房产信息
const getcardInfoHandle = () => {
  getcardInfoApi({
    openId: userStore.openId,
  }).then((res) => {
    if (res.success) {
      fcMsg.value = res.data[0];
    }
  });
};
// 提交投诉
const addTsHandle = () => {
  if(!qusForm.title){
     uni.$u.toast('请检查信息是否填写完整！')
    return false
  }else{
    addTsApi(qusForm).then((res) => {
      if (res.success) {
        uni.$u.toast("添加成功");
        uni.requestSubscribeMessage({
          tmplIds: ["kHG3CMCR3R_t0P2_aq01odJH7Rqv4L45QwUlnwq12Mc"],
          success: (res) => {
            console.log('res: ', res);
            if (res[templateId] === 'accept') {
              console.log("接受订阅");
            }else{
				uni.$u.toast("未接受订阅，将无法及时接受信息！")
			}
          }
        })

        qusForm.title = "";
        qusForm.content = "";
      } else {
        uni.$u.toast(res.msg);
      }
    });
  }
};
onLoad(() => {
  tsTime.value = day(Date.now()).format("YYYY-MM-DD HH:mm:ss");
  getcardInfoHandle();
});
</script>

<style lang="scss" scoped>
.wyts-wrapper {
  padding-top: 28rpx;

  .qus-block {
    background-color: #fff;
    border-radius: 12rpx;
    box-sizing: border-box;
    padding: 28rpx 32rpx;
  }

  .bx-msg {
    background-color: #fff;
  }
}
</style>
